<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>详情页</title>
    <link rel="stylesheet" href="css/detail.css">
</head>

<body>
    <header>
        <div class="w">
            <div class="top">
                <a href="index.html">
                    <div class="back">
                        Back
                    </div>
                </a>
                <h3>
                    产品详细
                </h3>
                <img src="img/star.png" alt="">
            </div>
        </div>
    </header>
    <main>

        <img src="img/详情页-top.zip.png" alt="">
        <div class="buy">
            <div class="lt">
                ￥32
            </div>
            <div class="rt">
                购买
            </div>
        </div>
        <div class="hp">
            <div class="lt">
                <img src="img/star.png" alt="">
                <div class="lt_1">
                    <span>好评度</span>
                    <span>99%</span>
                </div>
            </div>
            <div class="rt">
                共605个评价&gt;
            </div>
        </div>
        <div class="bg">
            <h5>
                适用商户
            </h5>
            <span>&gt;</span>
        </div>

        <div class="main">
            <div class="first">
                <img src="img/产品详细页_01.png" alt="">
                <div>
                    <h5>万岁寿司（正佳店）</h5>
                    <div>
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        10分
                    </div>
                    <p>离你100m</p>
                    <a href="">查看详情</a>
                </div>
                <a href="">进入</a>
            </div>

            <div class="first">
                <img src="img/产品详细页_02.png" alt="">
                <div>
                    <h5>万岁寿司（体育西店）</h5>
                    <div>
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        10分
                    </div>
                    <p>离你100m</p>
                    <a href="">查看详情</a>
                </div>
                <a href="">进入</a>
            </div>

            <div class="first">
                <img src="img/产品详细页_03.png" alt="">
                <div>
                    <h5>万岁寿司（昌岗店）</h5>
                    <div>
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        10分
                    </div>
                    <p>离你100m</p>
                    <a href="">查看详情</a>
                </div>
                <a href="">进入</a>
            </div>


            <div class="first">
                <img src="img/产品详细页_01.png" alt="">
                <div>
                    <h5>万岁寿司（正佳店）</h5>
                    <div>
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        10分
                    </div>
                    <p>离你100m</p>
                    <a href="">查看详情</a>
                </div>
                <a href="">进入</a>
            </div>

            <div class="first">
                <img src="img/产品详细页_02.png" alt="">
                <div>
                    <h5>万岁寿司（体育西店）</h5>
                    <div>
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        10分
                    </div>
                    <p>离你100m</p>
                    <a href="">查看详情</a>
                </div>
                <a href="">进入</a>
            </div>

            <div class="first">
                <img src="img/产品详细页_03.png" alt="">
                <div>
                    <h5>万岁寿司（昌岗店）</h5>
                    <div>
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        <img src="img/star.png" alt="">
                        10分
                    </div>
                    <p>离你100m</p>
                    <a href="">查看详情</a>
                </div>
                <a href="">进入</a>

            </div>
            <p>已经到底了</p>
        </div>
    </main>

    <!-- 底部导航栏 -->
    <nav>

        <div>
            <a href="index.html">
                <img src="img/首页0.png" alt="">
                <h5>首页</h5>
            </a>
        </div>
        <div>
            <a href="分类.html">
                <img src="img/分类4.png" alt="">
                <h5>分类</h5>
            </a>
        </div>
        <div>
            <a href="发现.html">
                <img src="img/发现.png" alt="">
                <h5>发现</h5>
            </a>
        </div>
        <div>
            <a href="我的.html">
                <img src="img/我的.png" alt="">
                <h5>我的</h5>
            </a>
        </div>
    </nav>
</body>

</html>